<template>
	<view class="mainBg h100">
		<navbar title="个人设置" />
		<navigator :url="`./avatar?avatarUrl=${info.avatarUrl}`">
			<view class="content info">
				<view class="left">
					<image :src="info.avatarUrl" mode=""></image>头像
				</view>
				<uni-icons type="right" size="16" color="#ccc"></uni-icons>
			</view>
		</navigator>
		<view class="content ">
			<navigator :url="`./name?name=${info.nickname}`">
				<view class="col">
					我的名字
					<text>{{info.nickname}}</text>
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
			<navigator :url="`./phone?phone=${info.phonenumber}`">
				<view class="col">
					手机号码
					<text>{{info.phonenumber}}</text>
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
			<navigator :url="`./wx?wx=${info.wx}`">
				<view class="col">
					个人微信
					<text>{{info.wx}}</text>
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
			<navigator :url="`./email?email=${info.email}`">
				<view class="col">
					个人邮箱
					<text>{{info.email}}</text>
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
			<navigator url="./password">
				<view class="col">
					更新密码
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
		</view>
		<view class="content ">
			<navigator :url="`./referee?referee=${info.referee}`">
				<view class="col">
					推荐人
					<text>{{info.referee}}</text>
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
			<navigator :url="`./mentor?mentor=${info.mentor}`">
				<view class="col">
					我的导师
					<text>{{info.mentor}}</text>
					<uni-icons type="right" size="16" color="#ccc"></uni-icons>
				</view>
			</navigator>
		</view>
		<navigator :url="`./logOff`">
			<view class="content logOff">
				账号注销
			</view>
		</navigator>
		<view class="exit" @click="logout">
			退出登录
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {}
			}
		},
		onShow() {
			this.getInfo()
		},
		methods: {
			getInfo() {
				this.$post("/user/info").then(res => {
					this.info = res.data.userInfo
					this.info.wx = this.info.wx ? this.info.wx : ''
					this.info.email = this.info.email ? this.info.email : ''
					this.info.referee = this.info.referee ? this.info.referee : ''
					this.info.mentor = this.info.mentor ? this.info.mentor : ''
				})
			},
			logout() {
				uni.showModal({
					title: '系统提示',
					content: '您确认退出登录吗？',
					confirmText: '确定',
					cancelText: '取消',
					success: (res) => {
						if (res.confirm) {
							console.log('用户点击确定');
							uni.clearStorageSync("token")
							uni.switchTab({
								url: "/pages/index/index"
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #35CBAD;
	}

	.content {
		background-color: #fff;
		font-size: 28rpx;
		border-radius: 8rpx;
		padding: 10rpx 40rpx;
		margin-bottom: 40rpx;
	}

	.info {
		display: flex;
		align-items: center;
		justify-content: space-between;

		.left {
			display: flex;
			align-items: center;
			padding: 10rpx 0;

			image {
				width: 72rpx;
				height: 72rpx;
				border-radius: 50%;
				margin-right: 20rpx;
			}

		}
	}

	.col {
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
		padding: 20rpx 0;
		padding-right: 40rpx;

		.uni-icons {
			position: absolute;
			right: -20rpx;
		}

		text {
			color: #999;
		}
	}

	.logOff {
		text-align: center;
		line-height: 80rpx;
	}

	.exit {
		width: 80%;
		border: 2rpx solid rgba(155, 227, 224, 1);
		margin: 30rpx auto;
		line-height: 80rpx;
		border-radius: 100px;
		text-align: center;
	}
</style>